﻿<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>控制台 - Bootstrap后台管理系统模版Ace下载</title>
<meta name="keywords" content="Bootstrap模版,Bootstrap模版下载,Bootstrap教程,Bootstrap中文" />
<meta name="description" content="站长素材提供Bootstrap模版,Bootstrap教程,Bootstrap中文翻译等相关Bootstrap插件下载" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<!-- basic styles -->
<link href="assets/css/bootstrap.min.css" rel="stylesheet" />
<link rel="stylesheet" href="assets/css/font-awesome.min.css" />
<!--[if IE 7]>
		  <link rel="stylesheet" href="assets/css/font-awesome-ie7.min.css" />
		<![endif]-->
<!-- page specific plugin styles -->
<!-- fonts -->
<link rel="stylesheet" href1="http://fonts.googleapis.com/css?family=Open+Sans:400,300" />
<!-- ace styles -->
<link rel="stylesheet" href="assets/css/ace.min.css" />
<link rel="stylesheet" href="assets/css/ace-rtl.min.css" />
<link rel="stylesheet" href="assets/css/ace-skins.min.css" />
<!--[if lte IE 8]>
		  <link rel="stylesheet" href="assets/css/ace-ie.min.css" />
		<![endif]-->
<!-- inline styles related to this page -->
<!-- ace settings handler -->
<script src="assets/js/ace-extra.min.js"></script>
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
		<script src="assets/js/html5shiv.js"></script>
		<script src="assets/js/respond.min.js"></script>
		<![endif]-->
</head>
<body>
<div class="navbar navbar-default" id="navbar"> 
  <script type="text/javascript">
				try{ace.settings.check('navbar' , 'fixed')}catch(e){}
			</script>
  <div class="navbar-container" id="navbar-container">
    <div class="navbar-header pull-left"> <a href="#" class="navbar-brand"> <small> <i class="icon-leaf"></i> ACE后台管理系统 </small> </a> 
      <!-- /.brand --> 
    </div>
    <!-- /.navbar-header -->
    <div class="navbar-header pull-right" role="navigation">
      <ul class="nav ace-nav">
        <li class="grey"> <a data-toggle="dropdown" class="dropdown-toggle" href="#"> <i class="icon-tasks"></i> <span class="badge badge-grey">4</span> </a>
          <ul class="pull-right dropdown-navbar dropdown-menu dropdown-caret dropdown-close">
            <li class="dropdown-header"> <i class="icon-ok"></i> 还有4个任务完成 </li>
            <li> <a href="#">
              <div class="clearfix"> <span class="pull-left">软件更新</span> <span class="pull-right">65%</span> </div>
              <div class="progress progress-mini ">
                <div style="width:65%" class="progress-bar "></div>
              </div>
              </a> </li>
            <li> <a href="#">
              <div class="clearfix"> <span class="pull-left">硬件更新</span> <span class="pull-right">35%</span> </div>
              <div class="progress progress-mini ">
                <div style="width:35%" class="progress-bar progress-bar-danger"></div>
              </div>
              </a> </li>
            <li> <a href="#">
              <div class="clearfix"> <span class="pull-left">单元测试</span> <span class="pull-right">15%</span> </div>
              <div class="progress progress-mini ">
                <div style="width:15%" class="progress-bar progress-bar-warning"></div>
              </div>
              </a> </li>
            <li> <a href="#">
              <div class="clearfix"> <span class="pull-left">错误修复</span> <span class="pull-right">90%</span> </div>
              <div class="progress progress-mini progress-striped active">
                <div style="width:90%" class="progress-bar progress-bar-success"></div>
              </div>
              </a> </li>
            <li> <a href="#"> 查看任务详情 <i class="icon-arrow-right"></i> </a> </li>
          </ul>
        </li>
        <li class="purple"> <a data-toggle="dropdown" class="dropdown-toggle" href="#"> <i class="icon-bell-alt icon-animated-bell"></i> <span class="badge badge-important">8</span> </a>
          <ul class="pull-right dropdown-navbar navbar-pink dropdown-menu dropdown-caret dropdown-close">
            <li class="dropdown-header"> <i class="icon-warning-sign"></i> 8条通知 </li>
            <li> <a href="#">
              <div class="clearfix"> <span class="pull-left"> <i class="btn btn-xs no-hover btn-pink icon-comment"></i> 新闻评论 </span> <span class="pull-right badge badge-info">+12</span> </div>
              </a> </li>
            <li> <a href="#"> <i class="btn btn-xs btn-primary icon-user"></i> 切换为编辑登录.. </a> </li>
            <li> <a href="#">
              <div class="clearfix"> <span class="pull-left"> <i class="btn btn-xs no-hover btn-success icon-shopping-cart"></i> 新订单 </span> <span class="pull-right badge badge-success">+8</span> </div>
              </a> </li>
            <li> <a href="#">
              <div class="clearfix"> <span class="pull-left"> <i class="btn btn-xs no-hover btn-info icon-twitter"></i> 粉丝 </span> <span class="pull-right badge badge-info">+11</span> </div>
              </a> </li>
            <li> <a href="#"> 查看所有通知 <i class="icon-arrow-right"></i> </a> </li>
          </ul>
        </li>
        <li class="green"> <a data-toggle="dropdown" class="dropdown-toggle" href="#"> <i class="icon-envelope icon-animated-vertical"></i> <span class="badge badge-success">5</span> </a>
          <ul class="pull-right dropdown-navbar dropdown-menu dropdown-caret dropdown-close">
            <li class="dropdown-header"> <i class="icon-envelope-alt"></i> 5条消息 </li>
            <li> <a href="#"> <img src="assets/avatars/avatar.png" class="msg-photo" alt="Alex's Avatar" /> <span class="msg-body"> <span class="msg-title"> <span class="blue">Alex:</span> 不知道写啥 ... </span> <span class="msg-time"> <i class="icon-time"></i> <span>1分钟以前</span> </span> </span> </a> </li>
            <li> <a href="#"> <img src="assets/avatars/avatar3.png" class="msg-photo" alt="Susan's Avatar" /> <span class="msg-body"> <span class="msg-title"> <span class="blue">Susan:</span> 不知道翻译... </span> <span class="msg-time"> <i class="icon-time"></i> <span>20分钟以前</span> </span> </span> </a> </li>
            <li> <a href="#"> <img src="assets/avatars/avatar4.png" class="msg-photo" alt="Bob's Avatar" /> <span class="msg-body"> <span class="msg-title"> <span class="blue">Bob:</span> 到底是不是英文 ... </span> <span class="msg-time"> <i class="icon-time"></i> <span>下午3:15</span> </span> </span> </a> </li>
            <li> <a href="inbox.html"> 查看所有消息 <i class="icon-arrow-right"></i> </a> </li>
          </ul>
        </li>
        <li class="light-blue"> <a data-toggle="dropdown" href="#" class="dropdown-toggle"> <img class="nav-user-photo" src="assets/avatars/user.jpg" alt="Jason's Photo" /> <span class="user-info"> <small>欢迎光临,</small> Jason </span> <i class="icon-caret-down"></i> </a>
          <ul class="user-menu pull-right dropdown-menu dropdown-yellow dropdown-caret dropdown-close">
            <li> <a href="#"> <i class="icon-cog"></i> 设置 </a> </li>
            <li> <a href="#"> <i class="icon-user"></i> 个人资料 </a> </li>
            <li class="divider"></li>
            <li> <a href="#"> <i class="icon-off"></i> 退出 </a> </li>
          </ul>
        </li>
      </ul>
      <!-- /.ace-nav --> 
    </div>
    <!-- /.navbar-header --> 
  </div>
  <!-- /.container --> 
</div>
<div class="main-container" id="main-container"> 
  <script type="text/javascript">
				try{ace.settings.check('main-container' , 'fixed')}catch(e){}
			</script>
  <div class="main-container-inner"> <a class="menu-toggler" id="menu-toggler" href="#"> <span class="menu-text"></span> </a>
    <div class="sidebar" id="sidebar"> 
      <script type="text/javascript">
						try{ace.settings.check('sidebar' , 'fixed')}catch(e){}
					</script>
      <div class="sidebar-shortcuts" id="sidebar-shortcuts">
        <div class="sidebar-shortcuts-large" id="sidebar-shortcuts-large">
          <button class="btn btn-success"> <i class="icon-signal"></i> </button>
          <button class="btn btn-info"> <i class="icon-pencil"></i> </button>
          <button class="btn btn-warning"> <i class="icon-group"></i> </button>
          <button class="btn btn-danger"> <i class="icon-cogs"></i> </button>
        </div>
        <div class="sidebar-shortcuts-mini" id="sidebar-shortcuts-mini"> <span class="btn btn-success"></span> <span class="btn btn-info"></span> <span class="btn btn-warning"></span> <span class="btn btn-danger"></span> </div>
      </div>
      <!-- #sidebar-shortcuts -->
      <ul class="nav nav-list">
        <li class="active"> <a href="index.html"> <i class="icon-dashboard"></i> <span class="menu-text"> 控制台 </span> </a> </li>
        <li> <a href="typography.html"> <i class="icon-text-width"></i> <span class="menu-text"> 文字排版 </span> </a> </li>
        <li> <a href="#" class="dropdown-toggle"> <i class="icon-desktop"></i> <span class="menu-text"> UI 组件 </span> <b class="arrow icon-angle-down"></b> </a>
          <ul class="submenu">
            <li> <a href="elements.html"> <i class="icon-double-angle-right"></i> 组件 </a> </li>
            <li> <a href="buttons.html"> <i class="icon-double-angle-right"></i> 按钮 &amp; 图表 </a> </li>
            <li> <a href="treeview.html"> <i class="icon-double-angle-right"></i> 树菜单 </a> </li>
            <li> <a href="jquery-ui.html"> <i class="icon-double-angle-right"></i> jQuery UI </a> </li>
            <li> <a href="nestable-list.html"> <i class="icon-double-angle-right"></i> 可拖拽列表 </a> </li>
            <li> <a href="#" class="dropdown-toggle"> <i class="icon-double-angle-right"></i> 三级菜单 <b class="arrow icon-angle-down"></b> </a>
              <ul class="submenu">
                <li> <a href="#"> <i class="icon-leaf"></i> 第一级 </a> </li>
                <li> <a href="#" class="dropdown-toggle"> <i class="icon-pencil"></i> 第四级 <b class="arrow icon-angle-down"></b> </a>
                  <ul class="submenu">
                    <li> <a href="#"> <i class="icon-plus"></i> 添加产品 </a> </li>
                    <li> <a href="#"> <i class="icon-eye-open"></i> 查看商品 </a> </li>
                  </ul>
                </li>
              </ul>
            </li>
          </ul>
        </li>
        <li> <a href="#" class="dropdown-toggle"> <i class="icon-list"></i> <span class="menu-text"> 表格 </span> <b class="arrow icon-angle-down"></b> </a>
          <ul class="submenu">
            <li> <a href="tables.html"> <i class="icon-double-angle-right"></i> 简单 &amp; 动态 </a> </li>
            <li> <a href="jqgrid.html"> <i class="icon-double-angle-right"></i> jqGrid plugin </a> </li>
          </ul>
        </li>
        <li> <a href="#" class="dropdown-toggle"> <i class="icon-edit"></i> <span class="menu-text"> 表单 </span> <b class="arrow icon-angle-down"></b> </a>
          <ul class="submenu">
            <li> <a href="form-elements.html"> <i class="icon-double-angle-right"></i> 表单组件 </a> </li>
            <li> <a href="form-wizard.html"> <i class="icon-double-angle-right"></i> 向导提示 &amp; 验证 </a> </li>
            <li> <a href="wysiwyg.html"> <i class="icon-double-angle-right"></i> 编辑器 </a> </li>
            <li> <a href="dropzone.html"> <i class="icon-double-angle-right"></i> 文件上传 </a> </li>
          </ul>
        </li>
        <li> <a href="widgets.html"> <i class="icon-list-alt"></i> <span class="menu-text"> 插件 </span> </a> </li>
        <li> <a href="calendar.html"> <i class="icon-calendar"></i> <span class="menu-text"> 日历 <span class="badge badge-transparent tooltip-error" title="2&nbsp;Important&nbsp;Events"> <i class="icon-warning-sign red bigger-130"></i> </span> </span> </a> </li>
        <li> <a href="gallery.html"> <i class="icon-picture"></i> <span class="menu-text"> 相册 </span> </a> </li>
        <li> <a href="#" class="dropdown-toggle"> <i class="icon-tag"></i> <span class="menu-text"> 更多页面 </span> <b class="arrow icon-angle-down"></b> </a>
          <ul class="submenu">
            <li> <a href="profile.html"> <i class="icon-double-angle-right"></i> 用户信息 </a> </li>
            <li> <a href="inbox.html"> <i class="icon-double-angle-right"></i> 收件箱 </a> </li>
            <li> <a href="pricing.html"> <i class="icon-double-angle-right"></i> 售价单 </a> </li>
            <li> <a href="invoice.html"> <i class="icon-double-angle-right"></i> 购物车 </a> </li>
            <li> <a href="timeline.html"> <i class="icon-double-angle-right"></i> 时间轴 </a> </li>
            <li> <a href="login.html"> <i class="icon-double-angle-right"></i> 登录 &amp; 注册 </a> </li>
          </ul>
        </li>
        <li> <a href="#" class="dropdown-toggle"> <i class="icon-file-alt"></i> <span class="menu-text"> 其他页面 <span class="badge badge-primary ">5</span> </span> <b class="arrow icon-angle-down"></b> </a>
          <ul class="submenu">
            <li> <a href="faq.html"> <i class="icon-double-angle-right"></i> 帮助 </a> </li>
            <li> <a href="error-404.html"> <i class="icon-double-angle-right"></i> 404错误页面 </a> </li>
            <li> <a href="error-500.html"> <i class="icon-double-angle-right"></i> 500错误页面 </a> </li>
            <li> <a href="grid.html"> <i class="icon-double-angle-right"></i> 网格 </a> </li>
            <li> <a href="blank.html"> <i class="icon-double-angle-right"></i> 空白页面 </a> </li>
          </ul>
        </li>
      </ul>
      <!-- /.nav-list -->
      <div class="sidebar-collapse" id="sidebar-collapse"> <i class="icon-double-angle-left" data-icon1="icon-double-angle-left" data-icon2="icon-double-angle-right"></i> </div>
      <script type="text/javascript">
						try{ace.settings.check('sidebar' , 'collapsed')}catch(e){}
					</script> 
    </div>
    <div class="main-content">
      <div class="breadcrumbs" id="breadcrumbs"> 
        <script type="text/javascript">
							try{ace.settings.check('breadcrumbs' , 'fixed')}catch(e){}
						</script>
        <ul class="breadcrumb">
          <li> <i class="icon-home home-icon"></i> <a href="#">首页</a> </li>
          <li class="active">控制台</li>
        </ul>
        <!-- .breadcrumb -->
        <div class="nav-search" id="nav-search">
          <form class="form-search">
            <span class="input-icon">
            <input type="text" placeholder="Search ..." class="nav-search-input" id="nav-search-input" autocomplete="off" />
            <i class="icon-search nav-search-icon"></i> </span>
          </form>
        </div>
        <!-- #nav-search --> 
      </div>
      <div class="page-content">
        <div class="page-header">
          <h1> 控制台 <small> <i class="icon-double-angle-right"></i> 查看 </small> </h1>
        </div>
        <!-- /.page-header -->
        <div class="row">
          <div class="col-xs-12"> 
            <!-- PAGE CONTENT BEGINS -->
            <div class="alert alert-block alert-success">
              <button type="button" class="close" data-dismiss="alert"> <i class="icon-remove"></i> </button>
              <i class="icon-ok green"></i> 欢迎使用 <strong class="green"> Ace后台管理系统 <small>(v1.2)</small> </strong> ,轻量级好用的后台管理系统模版. </div>
            <div class="row">
              <div class="space-6"></div>
              <div class="col-sm-7 infobox-container">
                <div class="infobox infobox-green  ">
                  <div class="infobox-icon"> <i class="icon-comments"></i> </div>
                  <div class="infobox-data"> <span class="infobox-data-number">32</span>
                    <div class="infobox-content">2个评论</div>
                  </div>
                  <div class="stat stat-success">8%</div>
                </div>
                <div class="infobox infobox-blue  ">
                  <div class="infobox-icon"> <i class="icon-twitter"></i> </div>
                  <div class="infobox-data"> <span class="infobox-data-number">11</span>
                    <div class="infobox-content">新粉丝</div>
                  </div>
                  <div class="badge badge-success"> +32% <i class="icon-arrow-up"></i> </div>
                </div>
                <div class="infobox infobox-pink  ">
                  <div class="infobox-icon"> <i class="icon-shopping-cart"></i> </div>
                  <div class="infobox-data"> <span class="infobox-data-number">8</span>
                    <div class="infobox-content">新订单</div>
                  </div>
                  <div class="stat stat-important">4%</div>
                </div>
                <div class="infobox infobox-red  ">
                  <div class="infobox-icon"> <i class="icon-beaker"></i> </div>
                  <div class="infobox-data"> <span class="infobox-data-number">7</span>
                    <div class="infobox-content">调查</div>
                  </div>
                </div>
                <div class="infobox infobox-orange2  ">
                  <div class="infobox-chart"> <span class="sparkline" data-values="196,128,202,177,154,94,100,170,224"></span> </div>
                  <div class="infobox-data"> <span class="infobox-data-number">6,251</span>
                    <div class="infobox-content">页面查看次数</div>
                  </div>
                  <div class="badge badge-success"> 7.2% <i class="icon-arrow-up"></i> </div>
                </div>
                <div class="infobox infobox-blue2  ">
                  <div class="infobox-progress">
                    <div class="easy-pie-chart percentage" data-percent="42" data-size="46"> <span class="percent">42</span>% </div>
                  </div>
                  <div class="infobox-data"> <span class="infobox-text">交易使用</span>
                    <div class="infobox-content"> <span class="bigger-110">~</span> 剩余58GB </div>
                  </div>
                </div>
                <div class="space-6"></div>
                <div class="infobox infobox-green infobox-small infobox-dark">
                  <div class="infobox-progress">
                    <div class="easy-pie-chart percentage" data-percent="61" data-size="39"> <span class="percent">61</span>% </div>
                  </div>
                  <div class="infobox-data">
                    <div class="infobox-content">任务</div>
                    <div class="infobox-content">完成</div>
                  </div>
                </div>
                <div class="infobox infobox-blue infobox-small infobox-dark">
                  <div class="infobox-chart"> <span class="sparkline" data-values="3,4,2,3,4,4,2,2"></span> </div>
                  <div class="infobox-data">
                    <div class="infobox-content">获得</div>
                    <div class="infobox-content">$32,000</div>
                  </div>
                </div>
                <div class="infobox infobox-grey infobox-small infobox-dark">
                  <div class="infobox-icon"> <i class="icon-download-alt"></i> </div>
                  <div class="infobox-data">
                    <div class="infobox-content">下载次数</div>
                    <div class="infobox-content">1,205</div>
                  </div>
                </div>
              </div>
              <div class="vspace-sm"></div>
              <div class="col-sm-5">
                <div class="widget-box">
                  <div class="widget-header widget-header-flat widget-header-small">
                    <h5> <i class="icon-signal"></i> 访问来源 </h5>
                    <div class="widget-toolbar no-border">
                      <button class="btn btn-minier btn-primary dropdown-toggle" data-toggle="dropdown"> 本周 <i class="icon-angle-down icon-on-right bigger-110"></i> </button>
                      <ul class="dropdown-menu pull-right dropdown-125 dropdown-lighter dropdown-caret">
                        <li class="active"> <a href="#" class="blue"> <i class="icon-caret-right bigger-110">&nbsp;</i> 本周 </a> </li>
                        <li> <a href="#"> <i class="icon-caret-right bigger-110 invisible">&nbsp;</i> 上周 </a> </li>
                        <li> <a href="#"> <i class="icon-caret-right bigger-110 invisible">&nbsp;</i> 本月 </a> </li>
                        <li> <a href="#"> <i class="icon-caret-right bigger-110 invisible">&nbsp;</i> 上月 </a> </li>
                      </ul>
                    </div>
                  </div>
                  <div class="widget-body">
                    <div class="widget-main">
                      <div id="piechart-placeholder"></div>
                      <div class="hr hr8 hr-double"></div>
                      <div class="clearfix">
                        <div class="grid3"> <span class="grey"> <i class="icon-facebook-sign icon-2x blue"></i> &nbsp; likes </span>
                          <h4 class="bigger pull-right">1,255</h4>
                        </div>
                        <div class="grid3"> <span class="grey"> <i class="icon-twitter-sign icon-2x purple"></i> &nbsp; tweets </span>
                          <h4 class="bigger pull-right">941</h4>
                        </div>
                        <div class="grid3"> <span class="grey"> <i class="icon-pinterest-sign icon-2x red"></i> &nbsp; pins </span>
                          <h4 class="bigger pull-right">1,050</h4>
                        </div>
                      </div>
                    </div>
                    <!-- /widget-main --> 
                  </div>
                  <!-- /widget-body --> 
                </div>
                <!-- /widget-box --> 
              </div>
              <!-- /span --> 
            </div>
            <!-- /row -->
            <div class="hr hr32 hr-dotted"></div>
            <div class="row">
              <div class="col-sm-5">
                <div class="widget-box transparent">
                  <div class="widget-header widget-header-flat">
                    <h4 class="lighter"> <i class="icon-star orange"></i> 热门域名 </h4>
                    <div class="widget-toolbar"> <a href="#" data-action="collapse"> <i class="icon-chevron-up"></i> </a> </div>
                  </div>
                  <div class="widget-body">
                    <div class="widget-main no-padding">
                      <table class="table table-bordered table-striped">
                        <thead class="thin-border-bottom">
                          <tr>
                            <th> <i class="icon-caret-right blue"></i> 名称 </th>
                            <th> <i class="icon-caret-right blue"></i> 价格 </th>
                            <th class="hidden-480"> <i class="icon-caret-right blue"></i> 状态 </th>
                          </tr>
                        </thead>
                        <tbody>
                          <tr>
                            <td>internet.com</td>
                            <td><small> <s class="red">$29.99</s> </small> <b class="green">$19.99</b></td>
                            <td class="hidden-480"><span class="label label-info arrowed-right arrowed-in">销售中</span></td>
                          </tr>
                          <tr>
                            <td>online.com</td>
                            <td><small> <s class="red"></s> </small> <b class="green">$16.45</b></td>
                            <td class="hidden-480"><span class="label label-success arrowed-in arrowed-in-right">可用</span></td>
                          </tr>
                          <tr>
                            <td>newnet.com</td>
                            <td><small> <s class="red"></s> </small> <b class="green">$15.00</b></td>
                            <td class="hidden-480"><span class="label label-danger arrowed">待定</span></td>
                          </tr>
                          <tr>
                            <td>web.com</td>
                            <td><small> <s class="red">$24.99</s> </small> <b class="green">$19.95</b></td>
                            <td class="hidden-480"><span class="label arrowed"> <s>无货</s> </span></td>
                          </tr>
                          <tr>
                            <td>domain.com</td>
                            <td><small> <s class="red"></s> </small> <b class="green">$12.00</b></td>
                            <td class="hidden-480"><span class="label label-warning arrowed arrowed-right">售完</span></td>
                          </tr>
                        </tbody>
                      </table>
                    </div>
                    <!-- /widget-main --> 
                  </div>
                  <!-- /widget-body --> 
                </div>
                <!-- /widget-box --> 
              </div>
              <div class="col-sm-7">
                <div class="widget-box transparent">
                  <div class="widget-header widget-header-flat">
                    <h4 class="lighter"> <i class="icon-signal"></i> 销售统计 </h4>
                    <div class="widget-toolbar"> <a href="#" data-action="collapse"> <i class="icon-chevron-up"></i> </a> </div>
                  </div>
                  <div class="widget-body">
                    <div class="widget-main padding-4">
                      <div id="sales-charts"></div>
                    </div>
                    <!-- /widget-main --> 
                  </div>
                  <!-- /widget-body --> 
                </div>
                <!-- /widget-box --> 
              </div>
            </div>
            <div class="hr hr32 hr-dotted"></div>
            <div class="row">
              <div class="col-sm-6">
                <div class="widget-box transparent" id="recent-box">
                  <div class="widget-header">
                    <h4 class="lighter smaller"> <i class="icon-rss orange"></i> 最近 </h4>
                    <div class="widget-toolbar no-border">
                      <ul class="nav nav-tabs" id="recent-tab">
                        <li class="active"> <a data-toggle="tab" href="#task-tab">任务</a> </li>
                        <li> <a data-toggle="tab" href="#member-tab">会员</a> </li>
                        <li> <a data-toggle="tab" href="#comment-tab">评论</a> </li>
                      </ul>
                    </div>
                  </div>
                  <div class="widget-body">
                    <div class="widget-main padding-4">
                      <div class="tab-content padding-8 overflow-visible">
                        <div id="task-tab" class="tab-pane active">
                          <h4 class="smaller lighter green"> <i class="icon-list"></i> 可拖拽排序列表 </h4>
                          <ul id="tasks" class="item-list">
                            <li class="item-orange clearfix">
                              <label class="inline">
                                <input type="checkbox" class="ace" />
                                <span class="lbl"> 问答</span> </label>
                              <div class="pull-right easy-pie-chart percentage" data-size="30" data-color="#ECCB71" data-percent="42"> <span class="percent">42</span>% </div>
                            </li>
                            <li class="item-red clearfix">
                              <label class="inline">
                                <input type="checkbox" class="ace" />
                                <span class="lbl"> BUG修复</span> </label>
                              <div class="pull-right action-buttons"> <a href="#" class="blue"> <i class="icon-pencil bigger-130"></i> </a> <span class="vbar"></span> <a href="#" class="red"> <i class="icon-trash bigger-130"></i> </a> <span class="vbar"></span> <a href="#" class="green"> <i class="icon-flag bigger-130"></i> </a> </div>
                            </li>
                            <li class="item-default clearfix">
                              <label class="inline">
                                <input type="checkbox" class="ace" />
                                <span class="lbl">添加新的特征</span> </label>
                              <div class="inline pull-right position-relative dropdown-hover">
                                <button class="btn btn-minier bigger btn-primary"> <i class="icon-cog icon-only bigger-120"></i> </button>
                                <ul class="dropdown-menu dropdown-only-icon dropdown-yellow dropdown-caret dropdown-close pull-right">
                                  <li> <a href="#" class="tooltip-success" data-rel="tooltip" title="Mark&nbsp;as&nbsp;done"> <span class="green"> <i class="icon-ok bigger-110"></i> </span> </a> </li>
                                  <li> <a href="#" class="tooltip-error" data-rel="tooltip" title="Delete"> <span class="red"> <i class="icon-trash bigger-110"></i> </span> </a> </li>
                                </ul>
                              </div>
                            </li>
                            <li class="item-blue clearfix">
                              <label class="inline">
                                <input type="checkbox" class="ace" />
                                <span class="lbl"> 更新模版脚本</span> </label>
                            </li>
                            <li class="item-grey clearfix">
                              <label class="inline">
                                <input type="checkbox" class="ace" />
                                <span class="lbl"> 添加新皮肤</span> </label>
                            </li>
                            <li class="item-green clearfix">
                              <label class="inline">
                                <input type="checkbox" class="ace" />
                                <span class="lbl"> 升级服务端</span> </label>
                            </li>
                            <li class="item-pink clearfix">
                              <label class="inline">
                                <input type="checkbox" class="ace" />
                                <span class="lbl"> 清理垃圾</span> </label>
                            </li>
                          </ul>
                        </div>
                        <div id="member-tab" class="tab-pane">
                          <div class="clearfix">
                            <div class="itemdiv memberdiv">
                              <div class="user"> <img alt="Bob Doe's avatar" src="assets/avatars/user.jpg" /> </div>
                              <div class="body">
                                <div class="name"> <a href="#">Bob Doe</a> </div>
                                <div class="time"> <i class="icon-time"></i> <span class="green">20 min</span> </div>
                                <div> <span class="label label-warning label-sm">pending</span>
                                  <div class="inline position-relative">
                                    <button class="btn btn-minier bigger btn-yellow btn-no-border dropdown-toggle" data-toggle="dropdown"> <i class="icon-angle-down icon-only bigger-120"></i> </button>
                                    <ul class="dropdown-menu dropdown-only-icon dropdown-yellow pull-right dropdown-caret dropdown-close">
                                      <li> <a href="#" class="tooltip-success" data-rel="tooltip" title="Approve"> <span class="green"> <i class="icon-ok bigger-110"></i> </span> </a> </li>
                                      <li> <a href="#" class="tooltip-warning" data-rel="tooltip" title="Reject"> <span class="orange"> <i class="icon-remove bigger-110"></i> </span> </a> </li>
                                      <li> <a href="#" class="tooltip-error" data-rel="tooltip" title="Delete"> <span class="red"> <i class="icon-trash bigger-110"></i> </span> </a> </li>
                                    </ul>
                                  </div>
                                </div>
                              </div>
                            </div>
                            <div class="itemdiv memberdiv">
                              <div class="user"> <img alt="Joe Doe's avatar" src="assets/avatars/avatar2.png" /> </div>
                              <div class="body">
                                <div class="name"> <a href="#">Joe Doe</a> </div>
                                <div class="time"> <i class="icon-time"></i> <span class="green">1 hour</span> </div>
                                <div> <span class="label label-warning label-sm">pending</span>
                                  <div class="inline position-relative">
                                    <button class="btn btn-minier bigger btn-yellow btn-no-border dropdown-toggle" data-toggle="dropdown"> <i class="icon-angle-down icon-only bigger-120"></i> </button>
                                    <ul class="dropdown-menu dropdown-only-icon dropdown-yellow pull-right dropdown-caret dropdown-close">
                                      <li> <a href="#" class="tooltip-success" data-rel="tooltip" title="Approve"> <span class="green"> <i class="icon-ok bigger-110"></i> </span> </a> </li>
                                      <li> <a href="#" class="tooltip-warning" data-rel="tooltip" title="Reject"> <span class="orange"> <i class="icon-remove bigger-110"></i> </span> </a> </li>
                                      <li> <a href="#" class="tooltip-error" data-rel="tooltip" title="Delete"> <span class="red"> <i class="icon-trash bigger-110"></i> </span> </a> </li>
                                    </ul>
                                  </div>
                                </div>
                              </div>
                            </div>
                            <div class="itemdiv memberdiv">
                              <div class="user"> <img alt="Jim Doe's avatar" src="assets/avatars/avatar.png" /> </div>
                              <div class="body">
                                <div class="name"> <a href="#">Jim Doe</a> </div>
                                <div class="time"> <i class="icon-time"></i> <span class="green">2 hour</span> </div>
                                <div> <span class="label label-warning label-sm">pending</span>
                                  <div class="inline position-relative">
                                    <button class="btn btn-minier bigger btn-yellow btn-no-border dropdown-toggle" data-toggle="dropdown"> <i class="icon-angle-down icon-only bigger-120"></i> </button>
                                    <ul class="dropdown-menu dropdown-only-icon dropdown-yellow pull-right dropdown-caret dropdown-close">
                                      <li> <a href="#" class="tooltip-success" data-rel="tooltip" title="Approve"> <span class="green"> <i class="icon-ok bigger-110"></i> </span> </a> </li>
                                      <li> <a href="#" class="tooltip-warning" data-rel="tooltip" title="Reject"> <span class="orange"> <i class="icon-remove bigger-110"></i> </span> </a> </li>
                                      <li> <a href="#" class="tooltip-error" data-rel="tooltip" title="Delete"> <span class="red"> <i class="icon-trash bigger-110"></i> </span> </a> </li>
                                    </ul>
                                  </div>
                                </div>
                              </div>
                            </div>
                            <div class="itemdiv memberdiv">
                              <div class="user"> <img alt="Alex Doe's avatar" src="assets/avatars/avatar5.png" /> </div>
                              <div class="body">
                                <div class="name"> <a href="#">Alex Doe</a> </div>
                                <div class="time"> <i class="icon-time"></i> <span class="green">3 hour</span> </div>
                                <div> <span class="label label-danger label-sm">blocked</span> </div>
                              </div>
                            </div>
                            <div class="itemdiv memberdiv">
                              <div class="user"> <img alt="Bob Doe's avatar" src="assets/avatars/avatar2.png" /> </div>
                              <div class="body">
                                <div class="name"> <a href="#">Bob Doe</a> </div>
                                <div class="time"> <i class="icon-time"></i> <span class="green">6 hour</span> </div>
                                <div> <span class="label label-success label-sm arrowed-in">approved</span> </div>
                              </div>
                            </div>
                            <div class="itemdiv memberdiv">
                              <div class="user"> <img alt="Susan's avatar" src="assets/avatars/avatar3.png" /> </div>
                              <div class="body">
                                <div class="name"> <a href="#">Susan</a> </div>
                                <div class="time"> <i class="icon-time"></i> <span class="green">yesterday</span> </div>
                                <div> <span class="label label-success label-sm arrowed-in">approved</span> </div>
                              </div>
                            </div>
                            <div class="itemdiv memberdiv">
                              <div class="user"> <img alt="Phil Doe's avatar" src="assets/avatars/avatar4.png" /> </div>
                              <div class="body">
                                <div class="name"> <a href="#">Phil Doe</a> </div>
                                <div class="time"> <i class="icon-time"></i> <span class="green">2 days ago</span> </div>
                                <div> <span class="label label-info label-sm arrowed-in arrowed-in-right">online</span> </div>
                              </div>
                            </div>
                            <div class="itemdiv memberdiv">
                              <div class="user"> <img alt="Alexa Doe's avatar" src="assets/avatars/avatar1.png" /> </div>
                              <div class="body">
                                <div class="name"> <a href="#">Alexa Doe</a> </div>
                                <div class="time"> <i class="icon-time"></i> <span class="green">3天以前</span> </div>
                                <div> <span class="label label-success label-sm arrowed-in">approved</span> </div>
                              </div>
                            </div>
                          </div>
                          <div class="center"> <i class="icon-group icon-2x green"></i> &nbsp; <a href="#"> 查看所有会员 &nbsp; <i class="icon-arrow-right"></i> </a> </div>
                          <div class="hr hr-double hr8"></div>
                        </div>
                        <!-- member-tab -->
                        <div id="comment-tab" class="tab-pane">
                          <div class="comments">
                            <div class="itemdiv commentdiv">
                              <div class="user"> <img alt="Bob Doe's Avatar" src="assets/avatars/avatar.png" /> </div>
                              <div class="body">
                                <div class="name"> <a href="#">Bob Doe</a> </div>
                                <div class="time"> <i class="icon-time"></i> <span class="green">6 min</span> </div>
                                <div class="text"> <i class="icon-quote-left"></i> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque commodo massa sed ipsum porttitor facilisis &hellip; </div>
                              </div>
                              <div class="tools">
                                <div class="inline position-relative">
                                  <button class="btn btn-minier bigger btn-yellow dropdown-toggle" data-toggle="dropdown"> <i class="icon-angle-down icon-only bigger-120"></i> </button>
                                  <ul class="dropdown-menu dropdown-only-icon dropdown-yellow pull-right dropdown-caret dropdown-close">
                                    <li> <a href="#" class="tooltip-success" data-rel="tooltip" title="Approve"> <span class="green"> <i class="icon-ok bigger-110"></i> </span> </a> </li>
                                    <li> <a href="#" class="tooltip-warning" data-rel="tooltip" title="Reject"> <span class="orange"> <i class="icon-remove bigger-110"></i> </span> </a> </li>
                                    <li> <a href="#" class="tooltip-error" data-rel="tooltip" title="Delete"> <span class="red"> <i class="icon-trash bigger-110"></i> </span> </a> </li>
                                  </ul>
                                </div>
                              </div>
                            </div>
                            <div class="itemdiv commentdiv">
                              <div class="user"> <img alt="Jennifer's Avatar" src="assets/avatars/avatar1.png" /> </div>
                              <div class="body">
                                <div class="name"> <a href="#">Jennifer</a> </div>
                                <div class="time"> <i class="icon-time"></i> <span class="blue">15 min</span> </div>
                                <div class="text"> <i class="icon-quote-left"></i> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque commodo massa sed ipsum porttitor facilisis &hellip; </div>
                              </div>
                              <div class="tools">
                                <div class="action-buttons bigger-125"> <a href="#"> <i class="icon-pencil blue"></i> </a> <a href="#"> <i class="icon-trash red"></i> </a> </div>
                              </div>
                            </div>
                            <div class="itemdiv commentdiv">
                              <div class="user"> <img alt="Joe's Avatar" src="assets/avatars/avatar2.png" /> </div>
                              <div class="body">
                                <div class="name"> <a href="#">Joe</a> </div>
                                <div class="time"> <i class="icon-time"></i> <span class="orange">22 min</span> </div>
                                <div class="text"> <i class="icon-quote-left"></i> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque commodo massa sed ipsum porttitor facilisis &hellip; </div>
                              </div>
                              <div class="tools">
                                <div class="action-buttons bigger-125"> <a href="#"> <i class="icon-pencil blue"></i> </a> <a href="#"> <i class="icon-trash red"></i> </a> </div>
                              </div>
                            </div>
                            <div class="itemdiv commentdiv">
                              <div class="user"> <img alt="Rita's Avatar" src="assets/avatars/avatar3.png" /> </div>
                              <div class="body">
                                <div class="name"> <a href="#">Rita</a> </div>
                                <div class="time"> <i class="icon-time"></i> <span class="red">50 min</span> </div>
                                <div class="text"> <i class="icon-quote-left"></i> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque commodo massa sed ipsum porttitor facilisis &hellip; </div>
                              </div>
                              <div class="tools">
                                <div class="action-buttons bigger-125"> <a href="#"> <i class="icon-pencil blue"></i> </a> <a href="#"> <i class="icon-trash red"></i> </a> </div>
                              </div>
                            </div>
                          </div>
                          <div class="hr hr8"></div>
                          <div class="center"> <i class="icon-comments-alt icon-2x green"></i> &nbsp; <a href="#"> See all comments &nbsp; <i class="icon-arrow-right"></i> </a> </div>
                          <div class="hr hr-double hr8"></div>
                        </div>
                      </div>
                    </div>
                    <!-- /widget-main --> 
                  </div>
                  <!-- /widget-body --> 
                </div>
                <!-- /widget-box --> 
              </div>
              <!-- /span -->
              <div class="col-sm-6">
                <div class="widget-box ">
                  <div class="widget-header">
                    <h4 class="lighter smaller"> <i class="icon-comment blue"></i> 会话 </h4>
                  </div>
                  <div class="widget-body">
                    <div class="widget-main no-padding">
                      <div class="dialogs">
                        <div class="itemdiv dialogdiv">
                          <div class="user"> <img alt="Alexa's Avatar" src="assets/avatars/avatar1.png" /> </div>
                          <div class="body">
                            <div class="time"> <i class="icon-time"></i> <span class="green">4秒钟前</span> </div>
                            <div class="name"> <a href="#">Alexa</a> </div>
                            <div class="text">大家好啊</div>
                            <div class="tools"> <a href="#" class="btn btn-minier btn-info"> <i class="icon-only icon-share-alt"></i> </a> </div>
                          </div>
                        </div>
                        <div class="itemdiv dialogdiv">
                          <div class="user"> <img alt="John's Avatar" src="assets/avatars/avatar.png" /> </div>
                          <div class="body">
                            <div class="time"> <i class="icon-time"></i> <span class="blue">38秒以前</span> </div>
                            <div class="name"> <a href="#">John</a> </div>
                            <div class="text">框架很好用嘛</div>
                            <div class="tools"> <a href="#" class="btn btn-minier btn-info"> <i class="icon-only icon-share-alt"></i> </a> </div>
                          </div>
                        </div>
                        <div class="itemdiv dialogdiv">
                          <div class="user"> <img alt="Bob's Avatar" src="assets/avatars/user.jpg" /> </div>
                          <div class="body">
                            <div class="time"> <i class="icon-time"></i> <span class="orange">2分钟以前</span> </div>
                            <div class="name"> <a href="#">Bob</a> <span class="label label-info arrowed arrowed-in-right">admin</span> </div>
                            <div class="text">欢迎大家使用ACE后台管理系统.</div>
                            <div class="tools"> <a href="#" class="btn btn-minier btn-info"> <i class="icon-only icon-share-alt"></i> </a> </div>
                          </div>
                        </div>
                        <div class="itemdiv dialogdiv">
                          <div class="user"> <img alt="Jim's Avatar" src="assets/avatars/avatar4.png" /> </div>
                          <div class="body">
                            <div class="time"> <i class="icon-time"></i> <span class="grey">3分钟以前</span> </div>
                            <div class="name"> <a href="#">Jim</a> </div>
                            <div class="text">大家多提提BUG</div>
                            <div class="tools"> <a href="#" class="btn btn-minier btn-info"> <i class="icon-only icon-share-alt"></i> </a> </div>
                          </div>
                        </div>
                        <div class="itemdiv dialogdiv">
                          <div class="user"> <img alt="Alexa's Avatar" src="assets/avatars/avatar1.png" /> </div>
                          <div class="body">
                            <div class="time"> <i class="icon-time"></i> <span class="green">4分钟以前</span> </div>
                            <div class="name"> <a href="#">Alexa</a> </div>
                            <div class="text">继续支持ACE后台系统</div>
                            <div class="tools"> <a href="#" class="btn btn-minier btn-info"> <i class="icon-only icon-share-alt"></i> </a> </div>
                          </div>
                        </div>
                      </div>
                      <form>
                        <div class="form-actions">
                          <div class="input-group">
                            <input placeholder="Type your message here ..." type="text" class="form-control" name="message" />
                            <span class="input-group-btn">
                            <button class="btn btn-sm btn-info no-radius" type="button"> <i class="icon-share-alt"></i> 发送 </button>
                            </span> </div>
                        </div>
                      </form>
                    </div>
                    <!-- /widget-main --> 
                  </div>
                  <!-- /widget-body --> 
                </div>
                <!-- /widget-box --> 
              </div>
              <!-- /span --> 
            </div>
            <!-- /row --> 
            <!-- PAGE CONTENT ENDS --> 
          </div>
          <!-- /.col --> 
        </div>
        <!-- /.row --> 
      </div>
      <!-- /.page-content --> 
    </div>
    <!-- /.main-content -->
    <div class="ace-settings-container" id="ace-settings-container">
      <div class="btn btn-app btn-xs btn-warning ace-settings-btn" id="ace-settings-btn"> <i class="icon-cog bigger-150"></i> </div>
      <div class="ace-settings-box" id="ace-settings-box">
        <div>
          <div class="pull-left">
            <select id="skin-colorpicker" class="hide">
              <option data-skin="default" value="#438EB9">#438EB9</option>
              <option data-skin="skin-1" value="#222A2D">#222A2D</option>
              <option data-skin="skin-2" value="#C6487E">#C6487E</option>
              <option data-skin="skin-3" value="#D0D0D0">#D0D0D0</option>
            </select>
          </div>
          <span>&nbsp; 选择皮肤</span> </div>
        <div>
          <input type="checkbox" class="ace ace-checkbox-2" id="ace-settings-navbar" />
          <label class="lbl" for="ace-settings-navbar"> 固定导航条</label>
        </div>
        <div>
          <input type="checkbox" class="ace ace-checkbox-2" id="ace-settings-sidebar" />
          <label class="lbl" for="ace-settings-sidebar"> 固定滑动条</label>
        </div>
        <div>
          <input type="checkbox" class="ace ace-checkbox-2" id="ace-settings-breadcrumbs" />
          <label class="lbl" for="ace-settings-breadcrumbs">固定面包屑</label>
        </div>
        <div>
          <input type="checkbox" class="ace ace-checkbox-2" id="ace-settings-rtl" />
          <label class="lbl" for="ace-settings-rtl">切换到左边</label>
        </div>
        <div>
          <input type="checkbox" class="ace ace-checkbox-2" id="ace-settings-add-container" />
          <label class="lbl" for="ace-settings-add-container"> 切换窄屏 <b></b> </label>
        </div>
      </div>
    </div>
    <!-- /#ace-settings-container --> 
  </div>
  <!-- /.main-container-inner --> 
  <a href="#" id="btn-scroll-up" class="btn-scroll-up btn btn-sm btn-inverse"> <i class="icon-double-angle-up icon-only bigger-110"></i> </a> </div>
<!-- /.main-container --> 
<!-- basic scripts --> 
<!--[if !IE]> -->
<script type="text/javascript">
			window.jQuery || document.write("<script src='assets/js/jquery-2.0.3.min.js'>"+"<"+"script>");
		</script>
<!-- <![endif]--> 
<!--[if IE]>
<script src="assets/js/jquery-1.10.2.min.js"></script>
<![endif]--> 
<!--[if !IE]> -->
<script type="text/javascript">
			window.jQuery || document.write("<script src='assets/js/jquery-2.0.3.min.js'>"+"<"+"script>");
		</script>
<!-- <![endif]--> 
<!--[if IE]>
<script type="text/javascript">
 window.jQuery || document.write("<script src='assets/js/jquery-1.10.2.min.js'>"+"<"+"script>");
</script>
<![endif]--> 
<script type="text/javascript">
			if("ontouchend" in document) document.write("<script src='assets/js/jquery.mobile.custom.min.js'>"+"<"+"script>");
		</script> 
<script src="assets/js/bootstrap.min.js"></script> 
<script src="assets/js/typeahead-bs2.min.js"></script> 
<!-- page specific plugin scripts --> 
<!--[if lte IE 8]>
		  <script src="assets/js/excanvas.min.js"></script>
		<![endif]--> 
<script src="assets/js/jquery-ui-1.10.3.custom.min.js"></script> 
<script src="assets/js/jquery.ui.touch-punch.min.js"></script> 
<script src="assets/js/jquery.slimscroll.min.js"></script> 
<script src="assets/js/jquery.easy-pie-chart.min.js"></script> 
<script src="assets/js/jquery.sparkline.min.js"></script> 
<script src="assets/js/flot/jquery.flot.min.js"></script> 
<script src="assets/js/flot/jquery.flot.pie.min.js"></script> 
<script src="assets/js/flot/jquery.flot.resize.min.js"></script> 
<!-- ace scripts --> 
<script src="assets/js/ace-elements.min.js"></script> 
<script src="assets/js/ace.min.js"></script> 
<!-- inline scripts related to this page --> 
<script type="text/javascript">
			jQuery(function($) {
				$('.easy-pie-chart.percentage').each(function(){
					var $box = $(this).closest('.infobox');
					var barColor = $(this).data('color') || (!$box.hasClass('infobox-dark') ? $box.css('color') : 'rgba(255,255,255,0.95)');
					var trackColor = barColor == 'rgba(255,255,255,0.95)' ? 'rgba(255,255,255,0.25)' : '#E2E2E2';
					var size = parseInt($(this).data('size')) || 50;
					$(this).easyPieChart({
						barColor: barColor,
						trackColor: trackColor,
						scaleColor: false,
						lineCap: 'butt',
						lineWidth: parseInt(size/10),
						animate: /msie\s*(8|7|6)/.test(navigator.userAgent.toLowerCase()) ? false : 1000,
						size: size
					});
				})
			
				$('.sparkline').each(function(){
					var $box = $(this).closest('.infobox');
					var barColor = !$box.hasClass('infobox-dark') ? $box.css('color') : '#FFF';
					$(this).sparkline('html', {tagValuesAttribute:'data-values', type: 'bar', barColor: barColor , chartRangeMin:$(this).data('min') || 0} );
				});
			
			
			
			
			  var placeholder = $('#piechart-placeholder').css({'width':'90%' , 'min-height':'150px'});
			  var data = [
				{ label: "social networks",  data: 38.7, color: "#68BC31"},
				{ label: "search engines",  data: 24.5, color: "#2091CF"},
				{ label: "ad campaigns",  data: 8.2, color: "#AF4E96"},
				{ label: "direct traffic",  data: 18.6, color: "#DA5430"},
				{ label: "other",  data: 10, color: "#FEE074"}
			  ]
			  function drawPieChart(placeholder, data, position) {
			 	  $.plot(placeholder, data, {
					series: {
						pie: {
							show: true,
							tilt:0.8,
							highlight: {
								opacity: 0.25
							},
							stroke: {
								color: '#fff',
								width: 2
							},
							startAngle: 2
						}
					},
					legend: {
						show: true,
						position: position || "ne", 
						labelBoxBorderColor: null,
						margin:[-30,15]
					}
					,
					grid: {
						hoverable: true,
						clickable: true
					}
				 })
			 }
			 drawPieChart(placeholder, data);
			
			 /**
			 we saved the drawing function and the data to redraw with different position later when switching to RTL mode dynamically
			 so that's not needed actually.
			 */
			 placeholder.data('chart', data);
			 placeholder.data('draw', drawPieChart);
			
			
			
			  var $tooltip = $("<div class='tooltip top in'><div class='tooltip-inner'></div></div>").hide().appendTo('body');
			  var previousPoint = null;
			
			  placeholder.on('plothover', function (event, pos, item) {
				if(item) {
					if (previousPoint != item.seriesIndex) {
						previousPoint = item.seriesIndex;
						var tip = item.series['label'] + " : " + item.series['percent']+'%';
						$tooltip.show().children(0).text(tip);
					}
					$tooltip.css({top:pos.pageY + 10, left:pos.pageX + 10});
				} else {
					$tooltip.hide();
					previousPoint = null;
				}
				
			 });
			
			
			
			
			
			
				var d1 = [];
				for (var i = 0; i < Math.PI * 2; i += 0.5) {
					d1.push([i, Math.sin(i)]);
				}
			
				var d2 = [];
				for (var i = 0; i < Math.PI * 2; i += 0.5) {
					d2.push([i, Math.cos(i)]);
				}
			
				var d3 = [];
				for (var i = 0; i < Math.PI * 2; i += 0.2) {
					d3.push([i, Math.tan(i)]);
				}
				
			
				var sales_charts = $('#sales-charts').css({'width':'100%' , 'height':'220px'});
				$.plot("#sales-charts", [
					{ label: "Domains", data: d1 },
					{ label: "Hosting", data: d2 },
					{ label: "Services", data: d3 }
				], {
					hoverable: true,
					shadowSize: 0,
					series: {
						lines: { show: true },
						points: { show: true }
					},
					xaxis: {
						tickLength: 0
					},
					yaxis: {
						ticks: 10,
						min: -2,
						max: 2,
						tickDecimals: 3
					},
					grid: {
						backgroundColor: { colors: [ "#fff", "#fff" ] },
						borderWidth: 1,
						borderColor:'#555'
					}
				});
			
			
				$('#recent-box [data-rel="tooltip"]').tooltip({placement: tooltip_placement});
				function tooltip_placement(context, source) {
					var $source = $(source);
					var $parent = $source.closest('.tab-content')
					var off1 = $parent.offset();
					var w1 = $parent.width();
			
					var off2 = $source.offset();
					var w2 = $source.width();
			
					if( parseInt(off2.left) < parseInt(off1.left) + parseInt(w1 / 2) ) return 'right';
					return 'left';
				}
			
			
				$('.dialogs,.comments').slimScroll({
					height: '300px'
			    });
				
				
				//Android's default browser somehow is confused when tapping on label which will lead to dragging the task
				//so disable dragging when clicking on label
				var agent = navigator.userAgent.toLowerCase();
				if("ontouchstart" in document && /applewebkit/.test(agent) && /android/.test(agent))
				  $('#tasks').on('touchstart', function(e){
					var li = $(e.target).closest('#tasks li');
					if(li.length == 0)return;
					var label = li.find('label.inline').get(0);
					if(label == e.target || $.contains(label, e.target)) e.stopImmediatePropagation() ;
				});
			
				$('#tasks').sortable({
					opacity:0.8,
					revert:true,
					forceHelperSize:true,
					placeholder: 'draggable-placeholder',
					forcePlaceholderSize:true,
					tolerance:'pointer',
					stop: function( event, ui ) {//just for Chrome!!!! so that dropdowns on items don't appear below other items after being moved
						$(ui.item).css('z-index', 'auto');
					}
					}
				);
				$('#tasks').disableSelection();
				$('#tasks input:checkbox').removeAttr('checked').on('click', function(){
					if(this.checked) $(this).closest('li').addClass('selected');
					else $(this).closest('li').removeClass('selected');
				});
				
			
			})
		</script>
</body>
</html>
